import { isShowButton } from '@/utils/util';
import { Image } from 'antd';
import moment from 'moment';
import { Fragment } from 'react';

export const columns = ({ handleEdit, currentPermissions }) => [
  {
    title: 'ID',
    dataIndex: 'id',
    width: 40,
    align: 'left',
    hideInSearch: true,
    render: (text, record, index) => index + 1,
  },
  {
    title: '活动名称',
    dataIndex: 'name',
    width: 90,
    align: 'left',
    hideInSearch: true,
  },
  {
    title: '图片',
    dataIndex: 'path',
    width: 120,
    align: 'left',
    hideInSearch: true,
    render: (text) => (
      <div>
        <Image src={text} width={80} height={80} />
      </div>
    ),
  },
  {
    title: 'Tag/url',
    dataIndex: 'jumpPath',
    width: 120,
    align: 'left',
    hideInSearch: true,
    render: (_, record) => {
      if (record?.linkMenuTag && record?.jumpPath) {
        return (
          <span>
            <div>{record.linkMenuTag}</div>
            <div>{record.jumpPath}</div>
          </span>
        );
      } else {
        return record?.jumpPath || record?.linkMenuTag || '-';
      }
    },
  },
  {
    title: '排序',
    dataIndex: 'sort',
    width: 120,
    align: 'left',
    hideInSearch: true,
  },
  {
    title: '状态',
    dataIndex: 'status',
    ellipsis: true,
    width: 90,
    valueType: 'select',
    valueEnum: {
      [0]: {
        text: '待上架',
        status: 'Warning',
      },
      [1]: {
        text: '已上架',
        status: 'Success',
      },
      [-1]: {
        text: '已下架',
        status: 'Error',
      },
    },
  },
  {
    title: '活动时间',
    width: 180,
    dataIndex: 'showStartTime',
    align: 'left',
    hideInSearch: true,
    render: (_, record) => (
      <div>
        <div>
          开始时间：
          {(record.showStartTime && moment(record.showStartTime).format('YYYY-MM-DD HH:mm:ss')) ||
            '-'}
        </div>
        <div>
          结束时间：
          {(record.showEndTime && moment(record.showEndTime).format('YYYY-MM-DD HH:mm:ss')) || '-'}
        </div>
      </div>
    ),
  },
  {
    title: '操作',
    width: 90,
    align: 'left',
    hideInSearch: true,
    render: (record) => (
      <div>
        {isShowButton(currentPermissions, 'banner:bannerManage:edit') && (
          <a style={{ marginRight: 8 }} onClick={() => handleEdit('edit', record)}>
            编辑
          </a>
        )}
        {isShowButton(currentPermissions, 'banner:bannerManage:offShelf') && (record.status === 1 || record.status === 0) && (
          <Fragment>
            <a onClick={() => handleEdit('offShelf', record)}>下架</a>
          </Fragment>
        )}
        {/* {record.status === 0 && (
          <Fragment>
            <Divider type="vertical" />
            <a onClick={() => handleEdit('grounding', record)}>上架</a>
          </Fragment>
        )} */}
      </div>
    ),
  },
];
